interface Props {
	data: any;
}

import { Col, Descriptions, Row, Typography, Image } from "antd";
import styles from "./index.module.less";
import { map } from "lodash";

const { Paragraph, Text } = Typography;

export default (props: Props) => {
	const info = props.data?.aftersales_info ?? {};
	const items = [
		{
			key: "5",
			label: "退款金额",
			children: `${info?.format_user_refund_amount ?? 0}元`,
			span: 2
		},
		{
			key: "6",
			label: "件数",
			children: info?.refund_num
		},
		// {
		// 	key: "7",
		// 	label: "原因",
		// 	children: info?.aftersale_reason
		// },
		{
			key: "8",
			label: "描述",
			children: info?.aftersale_remark,
			span: 2
		},
		{
			key: "9",
			label: "凭证",
			children: (
				<Image.PreviewGroup>
					{map(info?.aftersale_thumbnail, (item, index) => (
						<Image key={index} width={60} src={item} />
					))}
				</Image.PreviewGroup>
			),
			contentStyle: { flexWrap: "wrap" }
		}
	];
	return (
		<div className={styles.container}>
			<div className={styles.title}>退款详情</div>
			<div className={styles.content}>
				<Row>
					<Col span={8} className={styles.content_title}>
						退款信息
					</Col>
				</Row>
				<Descriptions items={items} contentStyle={{ backgroundColor: "transparent" }} />
			</div>
		</div>
	);
};
